<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>精选</title>
    <link rel="shortcut icon" type="image/x-icon" href="img/enjoy-3.png">
    <link rel="stylesheet" type="text/css" href="lib/bootstrap-3.3.7/dist/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="lib/font-awesome-4.7.0/css/font-awesome.css">
    <link rel="stylesheet" href="css/footer-bar.css">
    <link rel="stylesheet" href="css/collect.css">
</head>
<header>
    <nav class="top-bar">
        <a href="#" class="title" style="text-decoration: none">
            <span class="icon-bar">ENJOY</span>
        </a>
        <div class="search">
            <i class="fa fa-search"></i>
        </div>
    </nav>
</header>
<div class="nav-divider"></div>
<section>
    <div class="row">
        <div class="col-xs-12">
            <p class="heading">今日推荐</p>
        </div>
        <div class="col-xs-12">
            <p class="subheading">全方位的生活指南，每天都有新乐趣</p>
        </div>
    </div>
    <div class="row container">
        <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
            <!-- Indicators -->
            <ol class="carousel-indicators">
                <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                <li data-target="#carousel-example-generic" data-slide-to="2"></li>
                <li data-target="#carousel-example-generic" data-slide-to="3"></li>
                <li data-target="#carousel-example-generic" data-slide-to="4"></li>
            </ol>
            <!-- Wrapper for slides -->
            <div class="carousel-inner" role="listbox">
                <div class="item active">
                    <img src="img/banner/banner-1.png" alt="banner">
                    <div class="carousel-caption">

                    </div>
                </div>
                <div class="item">
                    <img src="img/banner/banner-2.png" alt="banner">
                    <div class="carousel-caption">

                    </div>
                </div>
                <div class="item">
                    <img src="img/banner/banner-3.png" alt="banner">
                    <div class="carousel-caption">

                    </div>
                </div>
                <div class="item">
                    <img src="img/banner/banner-4.png" alt="banner">
                    <div class="carousel-caption">

                    </div>
                </div>
                <div class="item">
                    <img src="img/banner/banner-5.png" alt="banner">
                    <div class="carousel-caption">

                    </div>
                </div>
            </div>

            <!-- Controls -->
            <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                <span class="sr-only">Previous</span>
            </a>
            <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                <span class="sr-only">Next</span>
            </a>
        </div>
    </div>
</section>
<div class="nav-divider"></div>
<section>
    <div class="row icon-list">
        <div>
            <img src="img/icon/balloon.png" alt="">
            <p>精选好物</p>
        </div>
        <div>
            <img src="img/icon/gifts.png" alt="">
            <p>夏日清凉</p>
        </div>
        <div>
            <img src="img/icon/diamond.png" alt="">
            <p>泫雅风</p>
        </div>
        <div>
            <img src="img/icon/goodie-bag.png" alt="">
            <p>包袋分享</p>
        </div>
        <div>
            <img src="img/icon/high-heel.png" alt="">
            <p>一物一拾</p>
        </div>
    </div>
    <div class="nav-divider"></div>
</section>
<section>
    <div class="row">
        <div class="col-xs-12">
            <p class="heading">精选好物</p>
        </div>
        <div class="col-xs-12">
            <p class="subheading">全方位的生活指南，每天都有新乐趣</p>
        </div>
    </div>
    <div class="row goods-list">
        <div class="col-xs-6 goods">
            <img src="img/icon/enjoy-1.png" alt="" class="img-rounded">
        </div>
        <div class="col-xs-6 goods">
            <img src="img/icon/enjoy-4.png" alt="" class="img-rounded">
        </div>
    </div>
    <div class="row goods-list">
        <div class="col-xs-6 goods">
            <img src="img/icon/enjoy-2.png" alt="" class="img-rounded">
        </div>
        <div class="col-xs-6 goods">
            <img src="img/icon/enjoy-3.png" alt="" class="img-rounded">
        </div>
    </div>
    <div class="nav-divider"></div>
</section>
<section>
    <div class="row">
        <div class="col-xs-12">
            <p class="heading">夏日清凉</p>
        </div>
        <div class="col-xs-12">
            <p class="subheading">全方位的生活指南，每天都有新乐趣</p>
        </div>
    </div>
    <div class="row summer-list">
        <div class="col-xs-6 summer">
            <img src="img/icon/enjoy-5.png" alt="" class="img-rounded">
        </div>
        <div class="col-xs-6 summer">
            <img src="img/icon/enjoy-6.png" alt="" class="img-rounded">
        </div>
    </div>
    <div class="nav-divider"></div>
</section>
<section>
    <div class="row">
        <div class="col-xs-12">
            <p class="heading">泫雅风</p>
        </div>
        <div class="col-xs-12">
            <p class="subheading">全方位的生活指南，每天都有新乐趣</p>
        </div>
    </div>
    <div class="row xuan-list">
        <div class="col-xs-6 xuan">
            <a href="templates/goods-details.html">
                <img src="img/icon/enjoy-7.png" alt="" class="img-rounded">
            </a>
        </div>
        <div class="col-xs-6 xuan">
            <a href="templates/goods-details.html">
                <img src="img/icon/enjoy-8.png" alt="" class="img-rounded">
            </a>
        </div>
    </div>
    <div class="nav-divider"></div>
</section>
<section>
    <div class="row">
        <div class="col-xs-12">
            <p class="heading">包袋分享</p>
        </div>
        <div class="col-xs-12">
            <p class="subheading">全方位的生活指南，每天都有新乐趣</p>
        </div>
    </div>
    <div class="row bag-list">
        <div class="col-xs-6 bag">
            <img src="img/icon/enjoy-9.png" alt="" class="img-rounded">
        </div>
        <div class="col-xs-6 bag">
            <img src="img/icon/enjoy-10.png" alt="" class="img-rounded">
        </div>
    </div>
    <div class="nav-divider"></div>
</section>
<section>
    <div class="row">
        <div class="col-xs-12">
            <p class="heading">一物一拾</p>
        </div>
        <div class="col-xs-12">
            <p class="subheading">全方位的生活指南，每天都有新乐趣</p>
        </div>
    </div>
    <div class="row shoes-list">
        <div class="col-xs-6 shoes">
            <img src="img/icon/enjoy-11.png" alt="" class="img-rounded">
        </div>
        <div class="col-xs-6 shoes">
            <img src="img/icon/enjoy-12.png" alt="" class="img-rounded">
        </div>
    </div>
    <div class="nav-divider"></div>
</section>
<section>
    <p class="end">~ END ~</p>
</section>
<footer>
    <div id="footer-bar">
        <div class="item collect active">
            <a href="index.html" style="text-decoration: none">
                <div class="icon">
                    <i class="fa fa-tag fa-lg tag-img"></i>
                </div>
                <div class="icon-text">
                    <span class="footer-title">精选</span>
                </div>
            </a>
        </div>
        <div class="item find">
            <a href="templates/find.html" style="text-decoration: none">
                <div class="icon">
                    <i class="fa fa-heart fa-lg tag-img"></i>
                </div>
                <div class="icon-text">
                    <span class="footer-title">发现</span>
                </div>
            </a>
        </div>
        <div class="item shopping">
            <a href="templates/shopping-bag.html" style="text-decoration: none">
                <div class="icon">
                    <i class="fa fa-shopping-bag fa-lg tag-img"></i>
                </div>
                <div class="icon-text">
                    <span class="footer-title">购物袋</span>
                </div>
            </a>
        </div>
        <div class="item home">
            <a href="templates/home.html" style="text-decoration: none">
                <div class="icon">
                    <i class="fa fa-coffee fa-lg tag-img"></i>
                </div>
                <div class="icon-text">
                    <span class="footer-title">我的</span>
                </div>
            </a>
        </div>
    </div>
</footer>
<script src="lib/jquery/jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="lib/bootstrap-3.3.7/dist/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/footer-bar.js"></script>
<script src="js/index.js"></script>
</html>